{% extends 'InterArticleBundle::layout.admin.html.twig' %}



{% block header_title %}
ARTICLE
{% endblock %}

{% block css_script %}
<style>
.sortable {color:white;}
.loadingIcon {
    width: 100%;
    height: 100%;    
    position: absolute;
    background:url({{ asset('bundles/interarticle/images/loading.gif') }}) no-repeat center center;
}
.loadingBg {
    width: 100%;
    height: 100%;
    background-color: black;
    position: absolute;
    opacity: 0.5;
}
</style>
{% endblock %}

{% block content %}	
	<!-- Full width table -->
	<div class="col-lg-12">
		
		<div class="module no-padding">
			<div id="loading" style="display: none">
				<div class="loadingBg"></div>
				<div class="loadingIcon"></div>
			</div>
 			<div class="module-header"><h4>LIST</h4></div>
			<div class="module-content table-responsive">
				<table class="table table-striped" id="table_list_article">
					<thead>
						<tr>
							<th>{{ knp_pagination_sortable(pagination, 'Id', 'a.id') }}</th>
							<th{% if pagination.isSorted('a.Title') %} class="sorted"{% endif %}>{{ knp_pagination_sortable(pagination, 'Title', 'a.title') }}</th>
							<th>Created Date</th>
							<th class="text-right">Actions</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							{% for article in pagination %}
							<tr {% if loop.index is odd %}class="color"{% endif %}>
							    <td>{{ article.id }} </td>
							    <td>{{ article.title }}</td>
							    <td>{{ article.createdAt|created_ago  }}</td>
							    <td class="text-right">
									<button class="btn btn-xs btn-info" onclick="location.href='{{ path('inter_article_admin_view_article', {'id':article.id} ) }}'"><i class="icon-eye-open"></i></button>
									<button class="btn btn-xs btn-success" onclick="location.href='{{ path('inter_article_admin_edit_article') }}?id={{ article.id }}'" >Edit</button>
									<button class="btn btn-xs btn-danger" onclick="ArticleJavascript.deleteArticle({{ article.id }})">Delete</button>
								</td>
							    
							</tr>
							{% else %}
								<tr><td colspan="2"><p>There are no article entries </p></td></tr>
							{% endfor %}
						</tr>
						
					</tbody>
				</table>				
			</div>			
		</div>
		{# display navigation #}
		<div class="navigation" id="paging_navigation">
		    {{ knp_pagination_render(pagination,'InterArticleBundle:Pagination:pagination.html.twig' ) }}
		</div>
	</div>
	
	
{% endblock %}

{% block js_script %}
<script>

var ArticleJavascript = {
	deleteArticle:function(id) {
		if( confirm('Are you sure you want to continue?')) {
			window.location.replace("{{ path('inter_article_admin_delete_article') }}?id="+id);
		}
	},
	paging:function(p){
		$('#loading').show();
		$.ajax({
	        type: "POST",
	        url: "{{ url('inter_article_admin_article_paging_ajax') }}",
	        data: {
	           page: p
	        },
	        dataType: "json",
	        success: function(response) {
	            //console.log(response);
	            //alert(response.list);	            
				
	            $('#table_list_article').replaceWith(response.list);
	            $('#paging_navigation').replaceWith(response.paging);
	            $('#loading').hide();
	            	            
	        }
	    });
	}
}




</script>
{% endblock %}